body {
font-family: 'Droid Sans', sans-serif;
font-size: 12px;
color:#666666;
padding:0px;
margin:0px;
}
/* HEADER */
.header{
width: 100%;
height: 60px;
background-color: #ccccee;
color: #ffffff;
font-size: 57px;
border-bottom: 6px solid;
border-color: #aaaadd;
text-shadow: #aaaadd 3px 3px 4px;
padding-left:10px;
}
.header.highlight{ background-color:#eebbbb; border-color: #cc9999; text-shadow: #cc9999 3px 3px 4px;}
}
/* 'Online Now' box */
.online{float:right;text-align:right;} /* Contains the names of the online users*/
.onlinewrapper{position:absolute;right:80px;width: 100px;color:#888888;text-align:right;margin-top:31px;} /* Contain the 'online now' text and the online div*/

a:link{color: #bbbbee; font-weight:bold; text-decoration:none;}
a:visited{color: #bbbbee; font-weight:bold; text-decoration:none;}
a:hover{ color: #eebbbb;}

/* TEXTBOXES AND TEXTAREA FOR USER INPUT*/
.loginbox{} /* Input box on the login page */
.userinput{width:450px;padding:5px;} /* Textarea on the main chat page */
.textbox{
font-family: 'Droid Sans', sans-serif;
border: 2px solid;
border-color: #bbbbee;
color: #bbbbee;
font-size: 12px;
font-weight:bold;
}
.textbox.highlight{border-color:#eebbbb;color:#eebbbb;}

/* MESSAGES */
.message{
overflow:hidden;
width: 430px;
float:left;
margin-bottom:9px;
opacity: 0.0;
padding-left:10px;
padding-right:10px;
border: 1px solid;
border-color: #ccccef;
-moz-box-shadow: 3px 3px 4px #aaa;
-webkit-box-shadow: 3px 3px 4px #aaa;
box-shadow: 3px 3px 4px #aaa;
}
.message.mine{background-color: #e1e1f1;}
.message.notification{background-color:#ffcccc;}
.message.even {background-color: #f1f1f1;}
.message.odd {background-color: #e1e1e1;}
.message.highlight{
margin-left:-5px;
-moz-box-shadow: 7px 5px 7px #bbb;
-webkit-box-shadow: 7px 5px 7px #bbb;
box-shadow: 7px 5px 7px #bbb;
}
/*ELEMENTS WITHIN A MESSAGE*/
.messagebody{padding:3px; margin-top:5px;}
.name{font-weight:bold; font-size: 10px; float: right; padding: 3px;}
.time{font-size: 10px; float:right; padding: 3px; }
.changemode{float:right;}/*Link to switch between chat and search*/
/*MAIN AREAS*/
.maincontainer{width:1000px;}
.leftcolumn{width:500px;position:absolute;}
.rightcolumn{width:500px;position:absolute;}
.chatinput {width:450px; float:left; margin:31px 0px 10px 31px;} /* Area containing the input box */
.searchinput{width:250px; float:left; margin:31px 0px 10px 31px;}
.chatlog{width:450px; margin-left:20px; margin-top: 0px; padding:10px;} /* Area where the messages are displayed */
/* ERROR TEXT FROM THE SERVER */
.error{color:#aaaadd;}

